<template>
	<div id="drinkCardView">

	<!-- 	<div class="navAndBanner">
			<nav>
				<ul>
					<li><img src="../../assets/img/logo_03.png"></li>
					<li ><a href="" style="color:white">客人存酒仓管理</a></li>
					<li><a href="">充公酒管理</a></li>
					<li><a href="">视图</a></li>
					<li><a href="">报表</a></li>
					<li style="font-size: 24px;color: white;"><a href="" style="color:white">退出</a>/<span style="cursor: pointer;" @click="showpwd = true">修改密码</span></li>
					
				</ul>
			</nav>
			
		</div> -->
		<navAndBanner></navAndBanner>	
		<div class="img1">

		</div>
		<div style="height:1px;border-top:3px solid #ffcc00;width:76.4%;margin:0 auto;"></div>
		<div class="title">
			<span>统计日期</span><Date-picker type="date" placeholder="选择日期" confirm style="width: 14.58vw;margin-right:3.6vw;" size="large" v-model="date" @on-ok="aa">

		</Date-picker>
		<span>存酒类型</span>
		<Select v-model="type" style="width:14.58vw;margin-right:6.6vw;" size="large">
			<Option v-for="item in typeList" :value="item.value" :key="item.value">{{ item.label }}</Option>
		</Select>
		<button class="btn">打印</button>

		</div>
		<div style="width: 69.1vw;margin:0 auto;margin-top: 20px;">
			<Table :columns="columns1" border :data="list"></Table>
		</div>
		<div class="footer">
			<p>kqmts   &copy 2015-2017 All Rights Reserved</p>
			<p>川ICP备16020686号</p>
		</div>
		<!-- <passWord v-show="showpwd"></passWord> -->
</div>
</template>
<script>
	// import passWord from '../password.vue'
	import navAndBanner from '../navAndBanner.vue'
	export default {
		components:{
			navAndBanner
		},
		data(){
			return{
				type:"",
				typeList:[
				{
					value: 'beijing',
					label: '整支'
				},
				{
					value: 'shanghai',
					label: '散装'
				}
				],
				columns1:[
					{
                        title: '商品名称',
                        key: 'SPMC'
                    },
                    {
                        title: '前期库存',
                        key: 'QQKC'
                    },
                    {
                        title: '当日存酒',
                        key: 'DRCJ'
                    },
                    {
                        title: '当日取酒',
                        key: 'DRQJ'
                    },
                    {
                        title: '当日过期',
                        key: 'DRGQCJ'
                    },
                    {
                        title: '当前库存',
                        key: 'DQKC'
                    }
				],
				date:"",
				showpwd:false,
				list:[]
			}
		},
		
		mounted(){
			this.aa()
		},
		methods:{
			aa:function(){
				
			var _this = this
			//获取当前日期
			this.date = this.getNowFormatDate(0)
			this.userinfo = JSON.parse(sessionStorage.userinfo).data
			this.$http.post(`${this.URL}/api/ws/cj_summary`,{
				token:_this.userinfo.token,
				CXRQ:_this.date,
				// CXRQ:"2017-08-27",
				timestamp:new Date().getTime()
			})
			.then(function(res){
				if (res.data.error_code == 0) {
					_this.list = res.data.data
				}
				
			})
			},
			getNowFormatDate:function(timetype){
				var date = new Date();
				var seperator1 = "-";
				var seperator2 = ":";
				var month = date.getMonth() + 1;
				var strDate = date.getDate();
				if (month >= 1 && month <= 9) {
					month = "0" + month;
				}
				if (strDate >= 0 && strDate <= 9) {
					strDate = "0" + strDate;
				}
				if (timetype == 1) {
					var currentdate = date.getFullYear() + seperator1 + month + seperator1 + strDate
					+ " " + date.getHours() + seperator2 + date.getMinutes()
					+ seperator2 + date.getSeconds();
					return currentdate;
				}
				else{
					var currentdate = date.getFullYear() + seperator1 + month + seperator1 + strDate
					return currentdate;
				}
			},

		}
	}
</script>
<style scoped>
	.btn{
		width: 6.5vw;
		height: 34px;
		border:none;
		outline: none;
		background: #ffcc00;
		color:white;
		font-size: 20px;
		vertical-align: middle;
		border-radius: 10px
	}
	.title{
		width: 69.1vw;
		height: 85px;
		border-bottom: 1px solid #e6e2e2;
		margin:0 auto;
		margin-top: 35px;
		
	}
	.title span{
		margin-right: 20px;
		font-size: 24px;
	}
	.img1{
		background: url(../../assets/img/Title6.png);
		width: 969px;
		height: 74px;
		margin:0 auto;
		margin-top: 90px;margin-bottom: 80px;
	}
	.navAndBanner{
		background:linear-gradient(30deg,#b490ca,#5ebbe7);
		width: 100%;
		height: 120px;
		vertical-align: middle;
		padding-top: 40px
		
	}
	a{
		text-decoration: none;
	}
	nav ul li{
		display: inline-block;
		vertical-align: middle;
		margin-right: 5%
	}
	nav ul li a{
		font-size: 24px;
		color: #999999;
	}
	nav ul li:first-child{
		margin-left: 13%;
		margin-right: 15%;
	}
	nav ul li:last-child{
		margin-top: 12px;
		float: right
		
	}
	body{background-color: #1E1E1E}
	*{padding:0;margin: 0;list-style:none;font-family: "微软雅黑"}
	.footer{
		height: 125px;
		width: 100%;
		background:linear-gradient(30deg,#b490ca,#5ebbe7);
		text-align: center;
		vertical-align: middle;
		color: white;
		padding-top: 50px;
		margin-top: 125px
	}
</style>
